.app-header {
  position: relative;
  height: 8vh;
  display: flex;
  flex-direction: row;
  width: 100%;

  &--left, &--right {
    height: 100%;
    width: 20%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .8vw;
    line-height: 1;
  }
  &--left {
    margin-right: auto;
    span {
      margin-left: 10px;
    }
  }
  &--right {
    margin-left: auto;
    display: flex;
    justify-content: center;

    span {
      margin: 0 .5vw;
      padding: auto;
      line-height: 1;
    }
  }
  &--middle {
    flex: 1;
    text-align: center;
    background: url("../images/header.png") no-repeat center;
    background-size: contain;
    display: table-cell;
    vertical-align: middle;
    line-height: 1;
    font-size: 1.5vw;
    width: 60%;
    min-width: 60%;
    &:hover {
      cursor: pointer;
    }
  }
}
